<template>
	<view class="main-content">
		<MHeader>{{state.pageName}}</MHeader>
		<scroll-view scroll-y="true" style="height:calc(100% - 80rpx)">
			<view>
				<item name="单据编号">
					<view class="input">{{state.info.Data.BillNo}}</view>
				</item>
				<item name="单据状态">
					<view class="input">{{state.info.Data.DocumentStatus?state.status[state.info.Data.DocumentStatus]:''}}</view>
				</item>
				<item name="组织">
					<view class="input">{{state.info.Data.F_QUQY_OrgId?.Name[0].Value}}</view>
				</item>
				<item name="申请日期">
					<view class="input">{{state.info.Data.F_QUQY_Date?moment(state.info.Data.F_QUQY_Date).format('YYYY-MM-DD'):' '}}</view>
				</item>
				<item name="养殖批次">
					<view class="input">{{state.info.Data.F_QUQY_BreedingBatch?.Name[0].Value}}</view>
				</item>
				<item name="业务员">
					<view>{{state.info.Data.F_QUQY_Saleman?.Name[0].Value}}</view>
				</item>
				<item name="饲料供应商">
					<view>{{state.info.Data.F_QUQY_FeedSupplier?.Name[0].Value}}</view>
				</item>
				<item name="申请司机">
					<view class="input">{{state.info.Data.F_QUQY_ApplyDriver?.Name[0].Value}}</view>
				</item>
				<item name="车牌号">
					<view class="input">{{state.info.Data.F_QUQY_CarNumber}}</view>
				</item>
				<item name="联系电话">
					<view class="input">{{state.info.Data.F_QUQY_Phone}}</view>
				</item>
				<item name="客户地址">
					<view class="input">{{state.info.Data.F_QUQY_CustAddress}}</view>
				</item>
				<item name="拉料司机">
					<view>{{state.info.Data.F_QUQY_PullingDriver1?.Name[0].Value}}</view>
				</item>
				<item name="饲料发货组织">
					<view>{{state.info.Data.F_QUQY_FeedOrg?.Name[0].Value}}</view>
				</item>
				<item name="出货客户内码">
					<view>{{state.info.Data.F_QUQY_OutboundCustID}}</view>
				</item>
				<item name="是否内部采购">
					<view>{{state.info.Data.F_QUQY_InternalPur=='1'?"是":"否"}}</view>
				</item>
				<item name="出库仓库内码">
					<view>{{state.info.Data.F_QUQY_OutboundWHID}}</view>
				</item>
				<item name="是否退货">
					<view>{{state.info.Data.F_QUQY_ReturnOrNot=='1'?"是":"否"}}</view>
				</item>
				<item name="申请日期">
					<view>{{state.info.Data.F_QUQY_Date?moment(state.info.Data.F_QUQY_Date).format('YYYY-MM-DD'):' '}}</view>
				</item>
				<item name="备注">
					<view>{{state.info.Data.F_QUQY_Remarks}}</view>
				</item>
			</view>
			<MHeader hidTag>
				<van-icon name="cluster" color="#1989fa" style="margin-right: 10rpx" />
				饲料列表
			</MHeader>
			<view style="padding-bottom: 10rpx">
				<view class="card" v-for="(item, index) in state.info.Data.QUQY_t_FeedApplicationE">
					<view class="card-index">{{ index + 1 }}</view>
					<item name="饲料">
						<view>{{item.F_QUQY_Feed?.Name[0].Value}}</view>
					</item>
					<item name="申请单位">
						<view>{{item.F_QUQY_StoreUnit?.Name[0].Value}}</view>
					</item>
					<item name="申请数量(袋)">
						<view>{{item.F_RSUS_ApplyQty}}</view>
					</item>
					<item name="单价">
						<view style="padding-right: 35rpx;">{{item.F_QUQY_UnitPrice}}</view>
						<text class="symbol">元</text>
					</item>
					<item name="金额">
						<view style="padding-right: 35rpx;">{{item.F_QUQY_Amount}}</view>
						<text class="symbol">元</text>
					</item>
					<item name="税率">
						<view>{{item.F_QUQY_TaxRate?.Name[0].Value}}</view>
					</item>
					<item name="已出库数量">
						<view>{{item.F_QUQY_OutboundQty}}</view>
					</item>
					<item name="控料提示">
						<view>{{item.F_QUQY_ControlPrompt}}</view>
					</item>
				</view>
			</view>
		</scroll-view>
	</view>
	<Loading v-if="state.loading"></Loading>
</template>

<script setup>
	import moment from 'moment'
	import { reactive, ref, } from 'vue'
	import { onLoad } from '@dcloudio/uni-app'
	import kdApis from '/api/modularApi/kdApi.js'
	const state = reactive({
		info: {
			FormId: 'QUQY_FeedApplication',
			Data: {
				Model: {
					TypeName: null
				}
			}
		},
		status: {
			Z: '暂 存',
			A: '保 存',
			B: '审核中',
			C: '已审核',
			D: '重新审核'
		},
		loading: true
	})

	const getDetails = (Id) => {
		kdApis.formView({
			formId: 'QUQY_FeedApplication',
			data: { Id }
		}).then(res => {
			if (res) {
				state.info.Data = res
				state.loading = false
			}
		})
	}

	onLoad(async (query) => {
		if (query.Id) {
			state.pageName = "饲料申请详情"
			getDetails(query.Id)
		}
	})
</script>
<style lang="scss" scoped>
	.card {
		position: relative;
		width: calc(100% - 60rpx);
		margin: 20rpx auto;
		box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
		border-radius: 6rpx;

		.card-index {
			position: absolute;
			display: flex;
			width: 40rpx;
			height: 40rpx;
			padding-left: 10rpx;
			font-size: 24rpx;
			background: #409eff;
			color: #fff;
			clip-path: polygon(0 0, 0 40rpx, 10rpx 40rpx, 40rpx 10rpx, 40rpx 0);
		}
	}
</style>